<template>
  <div class="newsinfo-container">
    <!-- 大标题 -->
    <div class="title">新闻标题</div>
    <!-- 子标题 -->
    <div class="subtitle">
      <span>发布时间：2020/12/12/ 12：:12</span>
      <span>点击：0次</span>
    </div>

    <hr />
    <!-- 内容区域 -->
    <div class="content">
      Lorem ipsum dolor sit amet consectetur, adipisicing elit. Voluptatibus, nulla hic. Dolore delectus earum at itaque sed voluptatibus, pariatur minus et laudantium quibusdam, quos aspernatur, quae mollitia consequuntur nemo ad. Lorem ipsum dolor sit, amet consectetur adipisicing elit. Quidem, reprehenderit iste. Repellendus quibusdam quos cumque mollitia, odit pariatur consectetur voluptatem libero.
      <br />
      <br />Quas ab molestias, praesentium eveniet dolorem accusamus facilis et.Dolore delectus earum at itaque sed voluptatibus, pariatur minus et laudantium quibusdam, quos aspernatur, quae mollitia consequuntur nemo ad. Lorem ipsum dolor sit, amet consectetur adipisicing elit. Quidem, reprehenderit iste. Repellendus quibusdam quos cumque mollitia, odit pariatur consectetur voluptatem libero.
    </div>
    <!-- 评论区域子组件 -->
    <comment-box></comment-box>
  </div>
</template>

<script>
import comment from "../subcomponents/comment.vue";
export default {
  data(){
    return {}
  },
  components: {
    //注册子组件
    "comment-box": comment
  }
};
</script>

<style lang="scss"  scoped>
.newsinfo-container {
  padding: 4px;
  .title {
    font-size: 17px;
    color: red;
    text-align: center;
    margin: 15px 0;
  }
  .subtitle {
    font-size: 12px;
    color: #226aff;
    display: flex;
    justify-content: space-between;
  }
  .content {
  }
}
</style>